<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <button>按钮1</button>
    <button>按钮2</button>
    <button>按钮3</button>

    <script>
        // bind()也是改变this指向，类似于call(); 
        //     不同点，在于函数不会立即执行; 会返回一个改好了this的函数; 
        
        // 1. 语法;
        function fn(a, b) {
            console.log(a + b);
            console.log(this);
        }
        // 调用
        fn(1, 2);
        const f1 = fn.bind(document, 2, 3);
        console.log(f1);
        f1();

        // 点击按钮，延时1秒钟禁用;
        let btns = document.querySelectorAll('button');
        for (let i = 0; i < btns.length; i++) {
            btns[i].addEventListener('click', function () {
                // 延时禁用
                setTimeout(function () {
                    this.disabled = true;
                }.bind(btns[i]), 1000);
            })
        }
    </script>
</body>
</html>